<template>
	<div class="login">
		<!-- 左侧扫码登录 -->
		<div class="left">
			<div class="img">
				<img src="/src/assets/vue.svg" alt="">
			</div>
			<div class="title">
				<span>欧神注册领取</span>
				<span style="color:#114CEE;">新人礼包</span>
			</div>
		</div>
		<!-- 右侧账户登录 -->
		<div class="right">	
			<DealRegister v-show="isShow===1" @register="toSetPass"></DealRegister>
			<SetPassword v-show="isShow===2"></SetPassword>
		</div>
	</div>
</template>
<script setup lang="ts">
import DealRegister from './components/DealRegister.vue';
import SetPassword from './components/SetPassword.vue';
// 1展示交易注册 2展示设置密码
const isShow = ref<1|2>(1);

const toSetPass = (value: 1|2) => {
	isShow.value = value;
}


</script>
<style scoped lang="scss">
.login {
	display: flex;
	align-items: center;
	justify-content: space-around;
	padding: 5vh 0;

	>div {
		width: 30%;
	}

	.left {
		.title {
			margin-top: 20px;
			font-family: "Microsoft YaHei", "Microsoft YaHei";
			font-size: 28px;
			font-weight: 400;
			color: #000;
			text-align: center;
			letter-spacing: 10px;
		}

		.img {
			display: flex;
			align-items: center;
			justify-content: center;

			>img {
				width: 60%;
			}
		}
	}

	.right {
		
	}
}
</style>

